import { Component, OnInit } from '@angular/core';
import {
  SwiperConfigInterface,
  SwiperCoverflowEffectInterface,
  SwiperNavigationInterface
} from 'ngx-swiper-wrapper';


// 3D 切换效果参数设置
const coverflowEffectConfig: SwiperCoverflowEffectInterface = {
  rotate: 0,
  stretch: 200,
  depth: 200,
  modifier: 1,
  slideShadows: false
};
// 前进后退按钮配置
const navigationConfig: SwiperNavigationInterface = {
  nextEl: '.swiper-button-next',
  prevEl: '.swiper-button-prev',
  hideOnClick: true
};

@Component({
  selector: 'app-swiper-play',
  templateUrl: './swiper-play.component.html',
  styleUrls: ['./swiper-play.component.scss']
})
export class SwiperPlayComponent implements OnInit {
  config: SwiperConfigInterface;

  constructor() {

  }

  ngOnInit() {
    this.config = {
      direction: 'horizontal',
      // 开启鼠标的抓手状态
      grabCursor: true,
      // 被选中的滑块居中，默认居左
      centeredSlides: true,
      loop: true,
      slidesPerView: 'auto',
      autoplay: true,
      speed: 1000,
      coverflowEffect: coverflowEffectConfig,
      // 前进后退按钮设置
      navigation: navigationConfig
    };
  }

}
